<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      .test {
        color: blue;
      }
      .test1 {
        color: red;
      }
    </style>
    <script>
      //页面加载事件
      window.onload = function () {
        // document.getElementById('a').innerHTML = 888
      }
    </script>
  </head>
  <body>
    <!-- <h1 id="a" style="color: aqua">123123</h1>
    <img
      src="https://img-baofun.zhhainiao.com/market/133/226df35ae018d162edf05f34170a872a.mp4.jpg"
      alt=""
      onload="fun()"
    /> -->
    <input type="checkbox" checked onchange="fun()" />
    <input type="text" value="" onchange="fun()" />
    <select name="" id="" onchange="fun()">
      <option value="">1</option>
      <option value="">2</option>
      <option value="">3</option>
    </select>
    <button onclick="fun()">点击</button>
    <div>1231qweqwe</div>
  </body>
  <script>
    //bom---->浏览器
    //dom----->html文档
    //dom 通常 就是操作（dom节点 dom对象 dom元素）

    function fun() {
      //   document.getElementById('a').innerHTML = 999     //改变dom内容
      //   document.getElementById('a').className = 'test1' //改变dom属性
      //   document.getElementById('a').style.color = 'red' //改变dom样式
      //   document.getElementById('a').innerHTML = 'img'
      console.log(666)
    }
    //改变dom内容 改变dom 属性
  </script>
</html>
